<template>
	<view style="position: relative">
		<view v-if="pageLoaded" class="house-main" :style="
        $store.state.userOriented && bottomMan
          ? 'padding-bottom: 50px'
          : 'padding-bottom: 0'
      ">
			<!-- #ifdef APP-PLUS -->
			<view class="device-status_bar"></view>
			<!-- #endif -->

			<uni-nav-bar class="uni-nav-bar" fixed="true" style="margin-bottom: -88rpx" :background-color="navBarColor"
				:shadow="false" :border="navBarBorder" <!-- #ifdef APP-PLUS -->
				:status-bar="true"
				<!-- #endif -->
				>
				<view class="nav-bar-wrapper">
					<!-- #ifdef APP-PLUS || H5 -->
					<view class="nav-circle" @click="uniBack" :style="{ backgroundColor: navCircleColor }">
						<uni-icons type="back" :color="uniIconColor" size="20"></uni-icons>
					</view>
					<!-- #endif -->
					<view style="flex-grow: 1;"></view>
					<!-- #ifdef APP-PLUS -->
					<view class="nav-circle" style="margin-right: 10rpx;" :style="{ backgroundColor: navCircleColor }"
						v-if="USER_ORIENTED" @click="sharePYQ">
						<uni-icons type="pengyouquan" :color="uniIconColor" size="20"></uni-icons>
					</view>
					<view class="nav-circle" style="margin-right: 10rpx;" :style="{ backgroundColor: navCircleColor }"
						v-if="USER_ORIENTED" @click="shareWX">
						<uni-icons type="weixin" :color="uniIconColor" size="20"></uni-icons>
					</view>
					<!-- #endif -->
					<view class="nav-circle" :style="{ backgroundColor: navCircleColor }">
						<uni-icons v-if="apiData.house_detail.is_follow === 0" type="heart" :color="uniIconColor"
							size="20" @click="followThisThing(apiData.house_detail, house_type)">
						</uni-icons>
						<uni-icons @click="followThisThing(apiData.house_detail, house_type)" v-else type="heart-filled"
							size="20" color="#FF4444"></uni-icons>
					</view>
				</view>
			</uni-nav-bar>

			<view class="carousel">

				<swiper <!-- #ifdef MP-WEIXIN || H5 -->
					style="margin-top:-88rpx"
					<!-- #endif -->
					class="swiper-wrapper"
					:style="{ height: swiperHeight + 'px' }"
					@change="swiperChange"
					:current="indexForSwiper"
					:duration="swiperDuration"
					>
					<swiper-item class="swipe-item-image" v-for="(swiperItem, index) in topBanners"
						:key="'photo' + index" @click="toPreviewImage(topBanners, index)" :style="{
            backgroundImage: 'url(' + swiperItem + ')',
            height: swiperHeight + 'px',
          }">
					</swiper-item>
				</swiper>

				<view class="carousel-tap">
					<view class="swiper-indicator">
						<view class="move-bar" :style="moveBarPosition"></view>
						<view class="bar" :class="activeBannersGroup === 2 ? 'active' : ''">
							<text @click="clickChange(2)">外观图</text>
						</view>
						<view class="bar" :class="activeBannersGroup === 0 ? 'active' : ''">
							<text @click="clickChange(0)">实景图</text>
						</view>
						<view class="bar" :class="activeBannersGroup === 1 ? 'active' : ''">
							<text @click="clickChange(1)">设计图</text>
						</view>
					</view>
				</view>

				<view class="carousel-num">
					<view class="indexTag">
						<view>
							<text>{{ activeSwiperIndex }}/{{ picturesLength }}</text>
						</view>
					</view>
				</view>

				<view class="vr">
					<view class="vr-but" @click="getVR()" v-if="apiData.house_detail.vr_url">VR</view>
				</view>

			</view>

			<view class="title-detail-info" :style="displayBuildMode ? 'height: 370px' : ''">
				<view class="tags-wrapper">
					<view class="tag" v-for="(tag, index) in apiData.house_detail.sell_label" :key="index"
						v-if="index < 5 && tag">
						{{ tag }}
					</view>
				</view>
				<view class="building-title">
					{{ apiData.house_detail.title }}
				</view>

				<view class="below-details-title-wrapper">
					<!--  总售价 -->
					<view class="left-price" v-if="showSellPrice">
						<view class="cn-unit refer">参考价:</view>
						{{ (apiData.house_detail.house_sell_price || '0') | tenMillion }}
						<view class="cn-unit">
							<text v-if="apiData.house_detail.house_sell_price > 10000">万</text>
							元
						</view>
					</view>
					<!--租价-->
					<view class="left-price" v-else>
						<view class="cn-unit refer">参考价:</view>
						{{ (apiData.house_detail.house_price || '0') | tenMillion }}
						<view class="cn-unit">
							<text v-if="apiData.house_detail.house_price > 10000">万</text>
							元/月
						</view>
					</view>
					<view class="location-icon-text">
						<image src="../../static/dw.png" style="width: 20px; height: 20px; margin-right: 5px" mode="">
						</image>

						<view class="location-text-wrapper" v-if="!displayBuildMode">
							{{ apiData.house_detail.build.city }}-{{
                apiData.house_detail.build.area
              }}
						</view>
						<view class="location-text-wrapper" v-if="displayBuildMode">
							{{ apiData_build.build_detail.city }}-{{
                apiData_build.build_detail.area
              }}
						</view>
					</view>
				</view>

				<view class="houseCard" v-if="!displayBuildMode">
					<view class="wrapper-3">
						<text class="api-data">{{
                (showSellPrice
                  ? apiData.house_detail.house_sell_price_m
                  : apiData.house_detail.house_price_m) | removeDigit
              }}元/m²</text>
						<text class="title-3">单价</text>
						<view class="right-line"></view>
					</view>

					<view class="wrapper-3">
						<text class="api-data">{{
              apiData.house_detail.house_room
            }} + {{apiData.house_detail.house_hall}}</text>
						<text class="title-3">格局</text>
						<view class="right-line"></view>
					</view>

					<view class="wrapper-3">
						<text class="api-data">{{ apiData.house_detail.house_area }}m²</text>
						<text class="title-3">面积</text>
					</view>
				</view>

				<!--房源信息 START -->
				<view v-if="!displayBuildMode" class="building-OR-house-info">
					<view class="info-title">房源信息</view>
					<view class="details-wrapper">
						<!-- <view class="field">
							房间号：
							<text style="color: #000000">{{
                apiData.house_detail.house_number
              }}</text>
						</view> -->

						<view class="field">
							楼层：
							<text style="color: #000000">{{
                apiData.house_detail.house_floor
              }}</text>
						</view>

						<view class="field">
							面积：
							<text style="color: #000000">{{ apiData.house_detail.house_area }}m²</text>
						</view>

						<view class="field">
							格局：
							<text
								style="color: #000000">{{apiData.house_detail.house_room}}+{{apiData.house_detail.house_hall}}</text>
						</view>

						<view class="field">
							朝向：
							<text style="color: #000000">{{
                apiData.house_detail.house_direction
              }}</text>
						</view>

						<view class="field">
							装修：
							<text style="color: #000000">{{
                apiData.house_detail.house_renovation
              }}</text>
						</view>
						<view class="field">
							用途：
							<text style="color: #000000">{{
                apiData.house_detail.house_purpose
              }}</text>
						</view>

						<view class="field" style="width: 100%">
							家私：
							<text style="color: #000000">{{
                apiData.house_detail.mating_set || noData
              }}</text>
						</view>

						<view class="field" style="width: 100%">
							房源编号：
							<text style="color: #000000">{{
                apiData.house_detail.house_no
              }}</text>
						</view>
						<view class="field" style="width: 100%">
							委托时效：
							<text style="color: #000000">{{
                apiData.house_detail.house_entrust
              }}</text>
						</view>
					</view>
				</view>
				<!--房源信息 END -->
			</view>

			<!--盘源信息 START -->
			<view class="building-source-info building-source-info-forHouse">
				<view class="info-title"> 盘源信息 </view>

				<view class="content-wrapper" v-if="buildInfo.loaded">
					<text class="field">
						盘源名称：
						<text style="color: #000000">{{ buildInfo.title }}</text>
					</text>
					<text class="field">
						开发商：
						<text style="color: #000000">{{ buildInfo.build_developer }}</text>
					</text>
					<text class="field">
						宗地号：
						<text style="color: #000000">{{ buildInfo.build_no }}</text>
					</text>

					<text class="field half-width">
						宗地面积：
						<text style="color: #000000">{{ buildInfo.build_area_ancestral + '㎡' || noData }}
						</text>
					</text>

					<text class="field half-width">
						容积率：
						<text style="color: #000000">{{ buildInfo.plot_ratio }}</text>
					</text>

					<text class="field half-width">
						建筑面积：
						<text style="color: #000000">{{ buildInfo.build_area }}㎡</text>
					</text>

					<text class="field half-width">
						标准层高：
						<text style="color: #000000">{{
              buildInfo.standard || noData
            }}</text>
					</text>

					<text class="field half-width">
						批地时间：
						<text style="color: #000000">{{
              buildInfo.land_date || noData
            }}</text>
					</text>

					<text class="field half-width">
						使用年限：
						<text style="color: #000000">{{ buildInfo.durable_years }}年</text>
					</text>

					<text class="field half-width">
						竣工时间：
						<text style="color: #000000">{{ buildInfo.build_birth || noData }}
						</text>
					</text>

					<text class="field half-width">
						入伙时间：
						<text style="color: #000000">{{ buildInfo.board_time }}</text>
					</text>

					<text class="field">
						详细地址：
						<text style="color: #000000">{{ buildInfo.site || noData }}</text>
					</text>
				</view>
			</view>
			<!--盘源信息 END -->

			<!--盘源配套信息 START -->
			<view class="supporting-info">
				<view class="info-title"> 盘源配套信息 </view>
				<view class="content-wrapper">
					<text class="field">
						物业公司：
						<text style="color: #000000">{{
              buildInfo.property_company || noData
            }}</text>
					</text>
					<text class="field half-width">
						管理费：
						<text style="color: #000000">{{
              apiData.house_detail.build.management_fee || noData
            }}</text>
					</text>
					<text class="field half-width">
						电梯品牌：
						<text style="color: #000000">{{
              apiData.house_detail.build.elevator_brand || noData
            }}</text>
					</text>
					<text class="field half-width">
						电梯个数：
						<text style="color: #000000">{{
              apiData.house_detail.build.build_levator || noData
            }}</text>
					</text>

					<text class="field">
						停车位累计个数：
						<text style="color: #000000">{{
              apiData.house_detail.build.total_parking_number || noData
            }}</text>
					</text>

					<text class="field half-width">
						地面停车个数：
						<text style="color: #000000">{{
              apiData.house_detail.build.ground_parking_number || noData
            }}</text>
					</text>

					<text class="field half-width">
						地下停车个数：
						<text style="color: #000000">{{
              apiData.house_detail.build.underground_parking_number || noData
            }}</text>
					</text>

					<text class="field">
						停车费-普通月卡：
						<text style="color: #000000">{{
              apiData.house_detail.build.mouth_parking_fee || noData
            }}</text>
					</text>

					<text class="field">
						停车费-固定月卡：
						<text style="color: #000000">{{
              apiData.house_detail.build.fixed_parking_fee || noData
            }}</text>
					</text>

					<text class="field">
						停车费-临时：
						<text style="color: #000000">{{
              apiData.house_detail.build.temporary_parking_fee || noData
            }}</text>
					</text>

					<text class="field half-width">
						空调系统：
						<text style="color: #000000">{{
              apiData.house_detail.build.air_condition_system || noData
            }}</text>
					</text>

					<text class="field half-width">
						收费标准：
						<text style="color: #000000">{{
              apiData.house_detail.build.charge_standard || noData
            }}</text>
					</text>

					<text class="field half-width">
						水费：
						<text style="color: #000000">{{
              apiData.house_detail.build.water_fee || noData
            }}</text>
					</text>

					<text class="field half-width">
						电费：
						<text style="color: #000000">{{
              apiData.house_detail.build.electricity_fee || noData
            }}</text>
					</text>

					<text class="field half-width">
						是否上下水：
						<text style="color: #000000">{{
              yesNo(apiData.house_detail.build.is_fluctuation) || noData
            }}</text>
					</text>

					<text class="field half-width">
						是否排烟：
						<text style="color: #000000">{{
              yesNo(apiData.house_detail.build.is_smoke) || noData
            }}</text>
					</text>

					<text class="field half-width">
						是否排污：
						<text style="color: #000000">{{
              yesNo(apiData.house_detail.build.is_sewage)
            }}</text>
					</text>

					<text class="field half-width">
						排污费：
						<text style="color: #000000">{{
              apiData.house_detail.build.sewage_fee || noData
            }}</text>
					</text>
				</view>
			</view>
			<!--配套信息 END -->

			<view class="merchant-persons-wrapper" v-if="
          !displayBuildMode &&
          $store.state.userOriented &&
          merchant_list &&
          merchant_list.length > 0
        ">
				<view class="info-title">推荐招商人</view>
				<view class="persons-wrapper">
					<houseMan :house-item="houseItem" v-for="(person, index) in merchant_list" :person="person"
						v-if="index < 5" :key="index"></houseMan>
				</view>
			</view>

			<!--描述 START -->
			<view class="description" v-if="apiData.house_detail.remark">
				<view class="title">描述</view>

				<view style="padding: 15px">
					<rich-text class="body" :nodes="apiData.house_detail.remark"></rich-text>
				</view>
			</view>
			<!--描述 END -->

			<!--房源点评 START -->
			<view class="house-remarks-wrapper">
				<view class="title">房源点评</view>
				<scroll-view class="title-selection" scroll-x="true">
					<view class="select" @click="setActiveRemarkIndex(1)"
						:class="activeRemarkIndex === 1 ? 'active' : ''">房源亮点
					</view>
					<view class="select" @click="setActiveRemarkIndex(2)"
						:class="activeRemarkIndex === 2 ? 'active' : ''">大厦介绍
					</view>
					<view class="select" @click="setActiveRemarkIndex(3)"
						:class="activeRemarkIndex === 3 ? 'active' : ''">交通配套
					</view>
					<view class="select" @click="setActiveRemarkIndex(4)"
						:class="activeRemarkIndex === 4 ? 'active' : ''">物业介绍
					</view>
					<view class="select" @click="setActiveRemarkIndex(5)"
						:class="activeRemarkIndex === 5 ? 'active' : ''">周边配置
					</view>
					<view class="select" @click="setActiveRemarkIndex(6)"
						:class="activeRemarkIndex === 6 ? 'active' : ''">布局装修
					</view>
				</scroll-view>
				<view class="remark-item">
					<text class="logo-part">{{ activeRemarkItem }}</text>
				</view>
			</view>
			<!--房源点评 END -->

			<view class="location-periphery">
				<view class="info-title" style="margin-bottom: 15px">位置及周边配套
				</view>
				<map-widget :item="houseItem"></map-widget>
			</view>

			<view class="houseRecommend">
				<view class="info-title" style="font-weight: bold">附近房源推荐{{
            TESTING ? ' 本房id: ' + apiData.house_detail.id : ''
          }}</view>
				<view class="no-house-tips" v-if="apiData.near_house_list.length < 1">
					<text>暂无相关房源推荐</text>
				</view>
				<view v-else class="wrapper">
					<my-house-card v-for="(item, index) in apiData.near_house_list" :key="index" :item="item"
						:display-build-mode="displayBuildMode"></my-house-card>
				</view>
			</view>
			<!-- #ifdef MP-WEIXIN -->
			<view class="zw"></view>
			<!-- #endif -->
			<view class="bottom-man" v-if="isuser">
				<view style="padding: 5px 15px; width: 100%" class="flex">
					<view class="bottom-man-profile-photo" :style="{
              backgroundImage: `url(${bottomMan && bottomMan.head_thumb})`,
            }">
					</view>
					<view class="person-info" style="flex-grow: 1">
						<text class="name">{{
              (bottomMan && bottomMan.name) || '匿名'
            }}</text>

						<text class="company">{{
                (bottomMan && bottomMan.tenant && bottomMan.tenant.company) ||
                '启租网'
              }}
						</text>
					</view>
					<view @click="toMessaging(bottomMan, houseItem)" class="ManBut" style="">
						聊天
					</view>
					<view class="ManBut blue-button-call" @click="phoneCall(bottomMan.phone)">
						打电话
					</view>
				</view>
			</view>
			<view class="appoint-to-see-house" :style="scrolling ? 'right: -24vw;' : ''" @tap="appointToSeeHouse"
				v-if="isuser">
				<image src="../../static/appointToSeeHouse.png" mode="aspectFit"></image>
				预约看房
			</view>
		</view>

		<not-loaded v-show="!pageLoaded" :swiper-height="swiperHeight"></not-loaded>
	</view>
</template>

<script>
	import {
		appMixin,
		split2
	} from '../../util/reuse';
	import mapWidget from './mapWidget';
	import sHouseCard from '../../components/sHouseCard.vue';
	import myHouseCard from '../../components/myHouseCard';
	import houseMan from './houseMan.vue';
	import {
		filter
	} from '../../util/reuse/filter';
	import notLoaded from './notLoaded';
	import {
		ONLINE_SERVER_ADDRESS_BASE
	} from "../../util/network.js"
	import {
		d_uniShowToast,
		EX_SHORT_TOAST_DURATION,
		getRouterParam,
		MY_LOCATION,
		ROUTER_OBJ,
		TOAST_DURATION,
		uniShowToast,
		uniNavigate
	} from '../../util/misc';
	import {
		optionalTokenRequest,
		proRequest,
		tokenRequest,
	} from '../../util/network';
	import {
		myThrottle,
		removeValOf,
		uniRedirect,
		uniSetStorageSync,
		uniSwitchTab,
	} from '../../util/funcs';
	import {
		contact
	} from './contact';
	import {
		chatMixin
	} from '@/util/reuse/chatMixin';
	import mapBrowser from './mapBrowser';
	import {
		getWindowInfo
	} from '../../util/commonFuncs';
	import {
		USER_ORIENTED
	} from '../../util/config';
	import {
		TESTING
	} from '../../util/test';

	export default {
		mixins: [appMixin, contact, filter, chatMixin],
		data() {
			return {
				USER_ORIENTED: USER_ORIENTED, //true 用户端 false 招商端
				indexForSwiper: 0,
				swiperDuration: 500,
				topBanners: [],
				throttleTimer: null,
				// 设计图
				design_img: [],
				// 0: 实景图 (房源缩略图和轮播图), 1: 设计图, 2: 外观图(盘源缩略图)
				activeBannersGroup: 2,
				noData: TESTING ? '~HEY~' : '暂无数据',
				merchant_list: [],
				// navBarColor: 'rgba(255,255,255,0)',
				timer: null,
				scrolling: false,
				pageLoaded: false,
				showSellPrice: false, // true: 租价, false: 售价
				buildInfo: {
					standard: '',
					map: null, // 地图组件
					loaded: false,
					id: 21,
					title: '朝阳大厦(删除)',
					building_age: '1926',
					build_floor: 22,
					build_thumb: [
						'http://qizutest.com/upload/bd892c9be6c31ecf/f4cc78599189f75b.png',
					],
					property_company: '是豆腐干饭',
					build_developer: '发生的发生的',
					build_no: '123123123',
					build_area: '343434.00',
					plot_ratio: '90.00',
					build_green: '80',
					durable_years: '20.00',
					build_birth: '2020',
					board_time: '2020.11.05',
					site: '阿斯顿撒多',
				},
				webviewStyles: {
					// height: 375,
					// width: 375,
					position: 'static',
				},
				houseItem: {}, // 看房需要这个对象, 进行预约
				userToken: '',
				displayBuildMode: false, //  true 盘源展示, false 房源展示
				followed: 0, // 是否关注 0 未关注 1 已关注
				mapUtil: {},
				// active banners的activeIndex+1,
				activeSwiperIndex: 1,
				designImageIndex: 1,
				thumbIamgeIndex: 1,
				houseToView: {},
				apiData: {
					house_detail: {
						remark: '',
						design_img: [],
						house_furniture: '',
						air_conditioning_fee: '',
						area: '',
						build: {
							// 外观图
							build_thumb: [],
							discharge: '',
							land_date: '',
							building_age: '',
							build_floor: '',
							build_levator: 0,
						},
						build_id: -1,
						business: {
							head_thumb: '',
						},
						business_id: 10000,
						city: '',
						discharge: '',
						elevator_brand: '',
						employee_capacity: '',
						house_area: '',
						// 实景图
						house_banner: [],
						house_direction: '',
						house_entrust: '',
						house_floor: 0,
						house_floor_type: '',
						house_hall: '',
						house_levator: '',
						house_no: '',
						house_number: '',
						house_price: '',
						house_price_m: '',
						house_purpose: '',
						house_renovation: '',
						house_room: 5,
						house_structure: '',
						house_thumb: [],
						id: 10,
						is_follow: 0,
						mating_set: '', // 家私用这个字段
						parking_fee: '',
						property_costs: '',
						province: '',
						reviewer: {
							id: 10000,
							name: null,
							phone: ''
						},
						reviewer_id: 10000,
						room_hall: '',

						sell_around: '',
						sell_building: '',
						sell_label: '',
						sell_layout: '',
						sell_point: '',
						sell_property: '',
						sell_traffic: '',
						tenant: {},
						tenant_id: 0,
						title: '',
						utility_fee: '0',
					}, // 房源详情
					business_list: [], //招商人员列表
					sellbusiness: [], // 售招商人员信息列表
					sell_business_list: [],
					near_house_list: [], // 附近房源推荐
				},
				bottomMan: {
					phone: '',
					head_thumb: '',
				},
				// remarkArr: [],
				activeRemarkIndex: 1,
				remarkArray: [''],
				routerParams: '' //分享时传递的路由参数
			};
		},
		components: {
			sHouseCard,
			houseMan,
			myHouseCard,
			mapBrowser,
			mapWidget,
			notLoaded,
		},
		onPageScroll(e) {
			// console.log('event: ',e)
			this.orderHideEffect();
			this.navBarEffect(e);
		},
		onLoad(obj) {
			this.routerParams = obj.obj;
			let data = JSON.parse(obj.obj);
			this.houseItem.id= data.id;
			this.showSellPrice = data.showSellPrice;
			// console.log(this.showSellPrice);
			this.initPageData(() => {
				// 保存浏览记录
				tokenRequest('/history_record', {
					house_id: this.houseItem.id,
					house_type: this.showSellPrice ? 2 : 1,
				});
				// this.setWebView()
			});
			uni.$on('onClickChange', (index) => {
				// console.log('onClickChange: ',index);
				this.swiperChange({
					detail: {
						source: 'click'
					}
				}, index);
			});

		},
		
		mounted() {},
		
		beforeDestoy() {
			uni.$off('onClickChange');
		},
		computed: {
			isuser() {
				return this.$store.state.userOriented
			},
			house_type() {
				return this.showSellPrice ? 2 : 1;
			},
	
			picturesLength() {
				if (this.activeBannersGroup === 0) {
					return this.apiData.house_detail.house_banner.length;
				} else if (this.activeBannersGroup === 1) {
					return this.design_img.length;
				} else if (this.activeBannersGroup === 2) {
					// 外观图, 2
					return this.apiData.house_detail.build.build_thumb.length || -1;
				}
				return TESTING ? 'err' : 0;
			},

			// 实景图
			houseRealPictures() {
				return this.apiData.house_detail.house_banner;
			},
			moveBarPosition() {
				if (this.activeBannersGroup === 2) {
					return 'left: 0;';
				} else if (this.activeBannersGroup === 0) {
					return 'left: 33.3%;';
				} else if (this.activeBannersGroup === 1) {
					return 'left: 66.7%;';
				}
			},
			activeRemarkItem() {
				return this.remarkArray[this.activeRemarkIndex] || '无';
			},
		},
		methods: {
			getVR() {
				uniSetStorageSync(ROUTER_OBJ, {
					url: this.apiData.house_detail.vr_url
				});
				uniNavigate('/browser/browser');
			},
			//分享到微信
			shareWX() {
				let type = this.apiData.house_detail.house_sell_type != 3 ? this.apiData.house_detail.house_sell_type : 1
				let obj = this.apiData.house_detail
				uni.share({
					provider: "weixin",
					scene: "WXSceneSession",
					type: 0,
					href: `${ONLINE_SERVER_ADDRESS_BASE}/wap/#/pages/displayDetails/displayDetails?obj=${this.routerParams}`,
					title: obj.title,
					summary: "我正在使用启租app，赶紧跟我一起来体验！",
					imageUrl: obj.house_thumb[0],
					success: function(res) {
						// console.log('网站',`${ONLINE_SERVER_ADDRESS_BASE}/pc/#/house?id=${obj.id}&type=${type}`)
						// console.log("wx success:" + JSON.stringify(res));
					},
					fail: function(err) {
						// console.log("wx fail:" + JSON.stringify(err));
					}
				});
			},
			//分享到朋友圈
			sharePYQ() {
				let type = this.apiData.house_detail.house_sell_type != 3 ? this.apiData.house_detail.house_sell_type : 1
				let obj = this.apiData.house_detail
				uni.share({
					provider: "weixin",
					scene: "WXSenceTimeline",
					type: 0,
					href: `${ONLINE_SERVER_ADDRESS_BASE}/wap/#/pages/displayDetails/displayDetails?obj=${this.routerParams}`,
					title: obj.title,
					summary: "我正在使用启租app，赶紧跟我一起来体验！",
					imageUrl: obj.house_thumb[0],
					success: function(res) {
						// console.log('网站',`${ONLINE_SERVER_ADDRESS_BASE}/pc/#/house?id=${obj.id}&type=${type}`)
						// console.log("pyq success:" + JSON.stringify(res));
					},
					fail: function(err) {
						// console.log("pyq fail:" + JSON.stringify(err));
					}
				});
			},
			swiperTouch(e) {
				myThrottle.call(
					this,
					() => {
						// console.log(e);
					},
					1000
				);
			},
			swiperTouch2(e) {
				if (this.throttleTimer) {
					return;
				}
				this.throttleTimer = setTimeout(() => {
					// console.log(e);
					clearTimeout(this.throttleTimer);
					console.log('after clear', this.throttleTimer);
					this.throttleTimer = null;
				}, 400);
			},
			clickChange(index) {
				this.swiperDuration = 0;

				setTimeout(() => {
					this.swiperDuration = 500;
				}, 500);
				this.activeBannersGroup = index;
				let indexForSwiper = 0;
				// if (index === this.activeBannersGroup) return;
				if (this.activeBannersGroup === 2) {
					indexForSwiper = 0;
				} else if (this.activeBannersGroup === 0) {
					indexForSwiper += this.forRealImageFilter();
				} else if (this.activeBannersGroup === 1) {
					indexForSwiper += this.forDesignImgFilter();
				}

				this.activeSwiperIndex = 1;
				uni.$emit('onClickChange', indexForSwiper);
			},
			buildingBackground(arr) {
				if (arr) {
					return arr[0];
				} else return '';
			},
			orderHideEffect() {
				if (!USER_ORIENTED) return; // 仅在用户端需要让预约看房按钮隐藏
				// 你滑我就隐藏预约看房
				if (this.timer) {
					clearTimeout(this.timer);
				}
				this.scrolling = true;
				this.timer = setTimeout(() => {
					this.scrolling = false;
				}, EX_SHORT_TOAST_DURATION);
			},

			// 此方法用于web view 地图显示, 2020-1614放弃此方案
			async setWebView() {
				var height = 200; //定义动态的高度变量，如高度为定值，可以直接写
				let width = 0;
				let {
					windowHeight,
					windowWidth
				} = await getWindowInfo();
				var currentWebview = this.$scope.$getAppWebview(); //获取当前web-view
				var wv = currentWebview.children()[0];
				console.log('currentWebview', currentWebview.children());
				wv.setStyle({
					//设置web-view距离顶部的距离以及自己的高度，单位为px
					top: 600, //此处是距离顶部的高度，应该是你页面的头部
					height: height, //webview的高度
					width: windowWidth,
					scalable: false, //webview的页面是否可以缩放，双指放大缩小
					zIndex: 10,
				});
			},
			// link: https://ask.dcloud.net.cn/question/70828
			async setWebView2() {
				var pages = getCurrentPages();
				var page = pages[pages.length - 1];
				var currentWebview = page.$getAppWebview();
				let {
					windowHeight,
					windowWidth
				} = await getWindowInfo();
				let url =
					'https://map.qq.com/m/nearby/result/word=%E7%BE%8E%E9%A3%9F&centerX=114.086117&centerY=22.545574&mode=map/';
				var wb = plus.webview.create(url, '', {
					top: '180',
					bottom: '180',
					height: '375', // 100vw
					width: windowWidth,
				});
				currentWebview.append(wb);
			},
			setBuildInfo() {
				this.buildInfo = this.apiData.house_detail.build;
				this.buildInfo.loaded = true;
				// console.log(this.buildInfo)
			},

			setActiveRemarkIndex(index) {
				this.activeRemarkIndex = index;
			},

			initPageData(cb) {
				// 从storage 取值 uni.getStorageSync(MY_LOCATION)
				// let position = this.location_area;

				/// 发送请求
				let postData = {
					id: this.houseItem.id,
					house_type: this.house_type,
				};

				optionalTokenRequest('/detail', postData, {
					success: ({
						data
					}) => {
						if (data.code === 200) {
							this.apiData = data.data;
							this.design_img = this.apiData.house_detail.design_img || [];
							if (!this.apiData.house_detail.elevator_brand && TESTING) {
								this.apiData.house_detail.elevator_brand = 'gg';
							}

							if (!this.apiData.house_detail.house_levator && TESTING) {
								this.apiData.house_detail.house_levator = 'gg1';
							}
							if (TESTING) console.log('详情页全部数据: ', this.apiData);

							if (this.showSellPrice) {
								this.merchant_list = this.apiData.sell_business_list || [];
							} else {
								this.merchant_list = this.apiData.business_list || [];
							}
							// console.log('this.merchant_list: ', this.merchant_list);

							this.houseItem = {
								...this.apiData.house_detail,
								showSellPrice: this.showSellPrice,
							};
							// 清洗数据
							this.washData();
							cb && cb();
						} else {
							// 此房源已下架
							uniShowToast(data.msg);
							setTimeout(() => {
								uniSwitchTab('/home/home');
							}, TOAST_DURATION);
						}
					},
				});
			},
			setBottomMan() {
				// 底部招商人员电话
				this.bottomMan = this.merchant_list[0];
			},
			setTopLabels() {
				// 顶部标签数组
				/**
				 * "sell_point": "地铁便利",
				 * "sell_building": "地铁便利",
				 * "sell_traffic": "地铁便利",
				 * "sell_property": "地铁便利",
				 * "sell_around": "地铁便利",
				 * "sell_layout": "地铁便利",
				 */
				let temArr = [
					// this.apiData.house_detail.sell_label,
					this.apiData.house_detail.sell_point,
					this.apiData.house_detail.sell_building,
					this.apiData.house_detail.sell_traffic,
					this.apiData.house_detail.sell_property,
					this.apiData.house_detail.sell_around,
					this.apiData.house_detail.sell_layout,
				];

				for (let i = 0, len = temArr.length; i < len; i++) {
					if (temArr[i] === '') {
						removeValOf(temArr, '');
					}
				}
				this.remarkArray = this.remarkArray.concat(temArr);
			},
			// 清洗后端返回的数据
			washData() {
				this.setBottomMan();
				this.setTopLabels();
				this.setBuildInfo();
				// 设置顶部轮播图
				this.topBanners = this.apiData.house_detail.build.build_thumb.concat([
					...this.apiData.house_detail.house_banner,
					...this.design_img,
				]);

				// check imgs
				// if (TESTING && false)
				//   console.log(
				//     this.apiData.house_detail.build.build_thumb,
				//     this.apiData.house_detail.build.build_thumb.length,
				//     '\n',
				//     this.apiData.house_detail.house_banner,
				//     this.apiData.house_detail.house_banner.length,
				//     '\n',
				//     this.design_img,
				//     this.design_img.length
				//   );

				// 附近房源推荐 租售变两个
				split2(this.apiData.near_house_list);

				// 骨架屏效果消失
				this.pageLoaded = true;
			},
			forDesignImgFilter() {
				return (
					this.buildInfo.build_thumb.length +
					this.apiData.house_detail.house_banner.length
				);
			},
			forRealImageFilter() {
				return this.buildInfo.build_thumb.length;
			},
			filter_activeSwiperIndex() {
				let forDesignImgFilter = this.forDesignImgFilter();
				let forRealImageFilter = this.forRealImageFilter();
				// console.log(
				//   'forDesignImgFilter:',
				//   forDesignImgFilter,
				//   '\n',
				//   'forRealImageFilter',
				//   forRealImageFilter
				// );

				if (
					// 过滤为真实设计图索引
					this.activeSwiperIndex > forDesignImgFilter
				) {
					this.activeBannersGroup = 1;
					this.activeSwiperIndex -= forDesignImgFilter;
				} else if (
					//  过滤为真实 实景图索引
					this.activeSwiperIndex > forRealImageFilter
				) {
					this.activeBannersGroup = 0;
					this.activeSwiperIndex -= forRealImageFilter;
				} else {
					this.activeBannersGroup = 2;
				}
			},
			swiperChange(e, indexForSwiper) {
				// console.log('trig',e, indexForSwiper);
				if (!e.detail.source) return; // 过滤掉 索引变化, 自动触发swiperChange()
				// 不是通过滑动来触发的轮播图变更, 延续changeSwiper()的逻辑
				if (e.detail.source === 'click') {
					// console.log('trig judge');
					this.indexForSwiper = indexForSwiper;
					// console.log(this.indexForSwiper);
					return;
				} else {
					// console.log('via touch');
					this.activeSwiperIndex = e.detail.current + 1;
					this.filter_activeSwiperIndex();
				}
			},
			// 当前active的轮播图
			activeBanners() {
				if (this.activeBannersGroup === 0) {
					return this.apiData.house_detail.house_banner;
				} else if (this.activeBannersGroup === 1) {
					return this.design_img;
				} else {
					// 外观图, 2
					return this.apiData.house_detail.build.build_thumb;
				}
			},
			back() {
				uni.navigateBack();
			},
			async checkHouseIsStillValid(houseId, houseType) {
				let data = await proRequest('/detail', {
					id: houseId,
					house_type: houseType,
				});
				if (data.code !== 200) {
					uniShowToast(data.msg);
					return false;
				} else {
					return true; // valid = true
				}
			},
			async appointToSeeHouse() {

				if (!this.checkHouseIsStillValid(this.houseItem.id, this.house_type)) {
					return;
				}

				uniSetStorageSync(ROUTER_OBJ, {
					houseItem: this.houseItem,
					business_list: this.merchant_list,
					showSellPrice: this.showSellPrice, // true: 售价, false: 租价
					houseType: this.house_type

				});
				uni.navigateTo({
					url: '../lookHouse/lookHouse',
				});
			},
		},
	};
</script>

<style lang="scss" scoped>
	@import 'displayDetails';

	.zw {
		height: 110rpx;
		padding-bottom: constant(safe-area-inset-bottom);
		padding-bottom: env(safe-area-inset-bottom);
		box-sizing: content-box;
	}
</style>
